var myScroll,pullDownEl, pullDownOffset,pullUpEl, pullUpOffset,generatedCount = 0;  

function loaded() {  
  //动画部分   
  pullUpEl = document.getElementById('pullUp');
  // if(pullUpEl.offsetHeight!0)  {
  //   pullUpOffset = pullUpEl.offsetHeight;  
  // } 
  myScroll = new iScroll('wrapper', {  
      useTransition: true,  
      topOffset: pullDownOffset,  
      onRefresh: function () {  
      if (pullUpEl.className.match('loading')) {  
                    pullUpEl.className = '';  
                    pullUpEl.querySelector('.pullUpLabel').innerHTML = '上拉加载更多';  
                }  
      },  
      onScrollMove: function () {  
        if (this.y < (this.maxScrollY - 5) && !pullUpEl.className.match('flip')) {  
                      pullUpEl.className = 'flip';  
                      pullUpEl.querySelector('.pullUpLabel').innerHTML = '释放刷新';  
                      this.maxScrollY = this.maxScrollY;  
                  } else if (this.y > (this.maxScrollY + 5) && pullUpEl.className.match('flip')) {  
                      pullUpEl.className = '';  
                      pullUpEl.querySelector('.pullUpLabel').innerHTML = 'Pull up to load more...';  
                      this.maxScrollY = pullUpOffset;  
                  }  
      },  
      onScrollEnd: function () {  
      if (pullUpEl.className.match('flip')) {  
              pullUpEl.className = 'loading';  
              pullUpEl.querySelector('.pullUpLabel').innerHTML = '加载中';                 
              pullUpAction(); // Execute custom function (ajax call?)  
          }  
      }  
  });  
    
  loadAction();  
}  
document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);//阻止冒泡  
document.addEventListener('DOMContentLoaded', function () { setTimeout(loaded, 0); }, false);  

//初始状态，加载数据  
function loadAction(){  
  var el, li;  
  el = document.getElementById('thelist');  
  var ohTml='<div class="li"><div class="flex">脊椎疗程</div><div class="flex">67.00 </div><div class="flex"> <p class="leg">今天</p><p class="time">12:00</p></div></div>'
  for (i=0; i<10; i++) {
      li = document.createElement('div');
      li.innerHTML=ohTml
      el.appendChild(li,el.childNodes[0]);  
  }  
  myScroll.refresh();  
}  

//上拉加载更多数据  
function pullUpAction () {  
  setTimeout(function () {  
      var el, li;  
      el = document.getElementById('thelist');
      var ohTml='<div class="li"><div class="flex">脊椎疗程</div><div class="flex">67.00 </div><div class="flex"> <p class="leg">今天</p><p class="time">12:00</p></div></div>'  
      for (i=0; i<10; i++) {  
        li = document.createElement('div');
        li.innerHTML=ohTml
        el.appendChild(li,el.childNodes[0]);   
      }  
      myScroll.refresh();  
  }, 400);  
}  